<template>
	<view>
		<view class="btn_area">
			<view class="btn_summit" @click="importData">导入数据</view>
			<view class="btn_summit"></view>
			<view class="btn_summit"></view>
			<view class="btn_summit"></view>
		</view>

		<view>
			<view>运营商管理</view>
			<uni-forms-item name="code" label="运营商编号">
				<uni-easyinput v-model="formData.code"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item name="name" label="运营商名称 ">
				<uni-easyinput v-model="formData.name"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item name="user" label="运营商员工列表">
				<uni-easyinput v-model="user"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item name="warehouse" label="仓配商列表">
				<uni-easyinput v-model="warehouse"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item name="supplier" label="货主列表">
				<uni-easyinput v-model="supplier"></uni-easyinput>
			</uni-forms-item>
			<button @click="submit">提交</button>
		</view>
		<view class="">
			<view>仓库列表</view>
			<input type="text" v-model="code" />
			<button @click="getWarehouse">查询</button>
			<view class="" v-for="(item, index) in warehouseList" :key="index">
				<view class="item" v-for="(value, key, itemindex) in item" :key="itemindex" @click="select(key)">
					<view class="key">{{ key }}</view>
					<view class="value">{{ value }}</view>
				</view>
				<button @click="editInfo(key, value, index)">修改</button>
				<view v-if="key !== 'auditStatus'" class=""><input type="text" v-model="value" /></view>
				<view v-if="key === 'auditStatus'">
					<select name="" id="" v-model="value">
						<option value="applyed">applyed</option>
						<option value="audited">audited</option>
						<option value="paused">paused</option>
					</select>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
const db = uniCloud.databaseForJQL();
export default {
	data() {
		return {
			formData: {
				code: '',
				name: '',
				user: [],
				warehouse: [],
				supplier: []
			},
			user: '',
			warehouse: '',
			supplier: '',
			warehouseList: [],
			value: '',
			code: '',
			key: ''
		};
	},
	methods: {
		importData(){
			uni.navigateTo({
				url:'/pages/importData/importData'
			})
		},
		async submit() {
			console.log('1111', JSON.stringify(this.formData));
			this.formData.user = [{ uid: this.user }];
			this.formData.warehouse = [this.warehouse];
			this.formData.supplier = [this.supplier];

			try {
				const r = await db.collection('operator').add(this.formData);
				if (r.id) {
					uni.showToast({
						title: '增加成功'
					});
				}
			} catch (e) {
				console.log(e);
			}
		},
		select(key) {
			this.key = key;
		},
		async getWarehouse() {
			try {
				const r = await db
					.collection('warehouse')
					.where({
						warehouse_name: '供销云仓福州中心仓'
					})
					.get();
				console.log(JSON.stringify(r));
				this.warehouseList = r.data;
			} catch (e) {
				console.log(e);
			}
		},
		async editInfo(key, value, index) {
			try {
				// 打印调试信息
				console.log('修改信息：', { key, value, index, currentFormData: this.warehouseList });

				// 边界检查
				if (!Array.isArray(this.warehouseList)) {
					console.error('formData 不是数组');
					return;
				}

				if (index < 0 || index >= this.warehouseList.length) {
					console.error(`索引 ${index} 超出有效范围`);
					return;
				}

				// 确保当前项是对象
				if (typeof this.warehouseList[index] !== 'object' || this.warehouseList[index] === null) {
					console.warn(`索引 ${index} 的数据不是对象，初始化为空对象`);
					this.warehouseList[index] = {};
				}

				// 执行修改（使用参数 value 而非 this.value）
				this.warehouseList[index][key] = value;
				for (const warehouse of this.warehouseList) {
					const res = await db
						.collection('warehouse')
						.where({
							_id: warehouse._id
						})
						.update({
							...warehouse
						});
				}

				// 可选：触发数据更新通知（如 Vue 中的 $forceUpdate，根据框架决定）
				// this.$forceUpdate();
			} catch (error) {
				console.error('修改表单数据失败：', error);
			}
		}
	}
};
</script>

<style lang="scss" scoped>
	@import "../../common/global.scss";
.btn_area{
	display: flex;
	gap: 20rpx;
}
.item {
	display: flex;
	width: 700rpx;
	padding: 10rpx 20rpx;
	margin: 0 20rpx;
	justify-content: space-between;
}
.key {
	background-color: antiquewhite;
	margin-left: 10rpx;
}
</style>
